import { useParams } from 'react-router-dom'
import { useEffect, useState } from 'react'
import { getArticleById } from '@/apis/article'
import { Link } from 'react-router-dom'
const BlogDetail = () => {
  const { id } = useParams()
  const [article, setArticle] = useState(null)

  useEffect(() => {
    const fetchArticle = async () => {
      const res = await getArticleById(id)
      setArticle(res.data)
    }
    fetchArticle()
  }, [id])

  if (!article) return <div>加载中...</div>

  return (
    <div className="blog-detail">
      <h1>{article.title}</h1>
      <div className="admin-login-link">
      <Link to="/login">登录管理后台</Link>
    </div>
      <div className="meta">
        <span>发布日期: {article.pubdate}</span>
        <span>阅读数: {article.read_count}</span>
        <span>作者: {article.author}</span>
      </div>
      <div className="content" dangerouslySetInnerHTML={{ __html: article.contentHtml }} />
    </div>
  )
}

export default BlogDetail